<template>
  <div class='commonCss'>
    <!--<Tree v-if='controlTree' ref='funTree' :data="funcTree" show-checkbox multiple @on-check-change='resetTree(funcTree)' @on-select-change='resetTree(funcTree)'></Tree>-->
  </div>
</template>
<script>
import { mapState, mapMutations } from 'vuex'
export default {
  data() {
    return {
      setPower: []
    }
  },
  props: {
    funcTree: {
      type: Array,
      default: []
    }
  },
  created() {
  },
  computed: {
    ...mapState({
      controlTree: ({ rolePower }) => rolePower.controlTree
    })
  },
  methods: {
    ...mapMutations(['SET_TREE_SHOW', 'DEAL_FUN_POWER']),
    resetTree(nodes) {
      this.$store.commit('DEAL_FUN_POWER', true)
      this.setPower = []
      this.sendPower(nodes, this.setPower)
      this.$emit('function-power', this.setPower)
      this.$store.commit('SET_TREE_SHOW', false)
      const self = this
      setTimeout(function() {
        self.$store.commit('SET_TREE_SHOW', true)
      }, 1)
    },
    sendPower(tree, arr) {
      tree.forEach((item) => {
        if (item.checked || item.indeterminate) {
          arr.push(item.id)
        }
        if (item.children && item.children.length) {
          this.sendPower(item.children, arr)
        }
      })
      return arr
    }
  }
}
</script>
<style scoped>

</style>
